/**
 * @class Mask 继承于Panel，实现Panel Mask功能
 */
define('core/panel/Mask', ['jQuery', 'core/panel/Panel'], function( require ){
	var $ = require('jQuery'),
		Panel = require('core/panel/Panel'),
		mix = K.mix,
		extend = K.extend,
		UA = K.Browser,
		CustEvent = K.CustEvent;

	var Mask = extend( function( opts ){
		this._initMask( opts );
	}, Panel );

	mix( Mask.prototype, {
		_initMask: function( opts ){

			this.MASK_CLASS		=	'panel-mask';
			this.scrollInterval =	50,
			this.resizeInterval =	50,

			this.leftOffset		=	200,
			this.topOffset		=	200,
			this.rightOffset	=	0,
			this.bottomOffset	=	200;

			//Mask默认不支持Blur Close
			if( opts ){
				if( !( 'useBlurClose' in opts ) ){
					opts.useBlurClose = false;
				}
			}
			else{
				opts = {
					useBlurClose: false
				};
			}

			mix( this, opts );

			Mask.$super.call( this, opts );

			if( this._iframe ){
				this._coverIframe();
			}

			CustEvent.createEvents(this, 'activate');

			this._addMaskEvent();

			var pos = this._canbeFixed() ? 'fixed' : 'absolute';
			this.addClass( this.MASK_CLASS );
			this.setStyle('position', pos);

			this.addClass( this.className );

			var ins = this;
			this.on('aftershow',function(){
				ins.adaptBounds();
			});
		},
		_addMaskEvent: function() {

			var instance = this;

			if( !this._canbeFixed() ) {

				$(window).bind( 'scroll', function() {
					clearTimeout(instance._scrollTimer);

					instance._scrollTimer = setTimeout(function() {
						clearTimeout(instance._scrollTimer);
						instance.adaptBounds();
					}, instance.scrollInterval);

				});

				$(window).bind( 'resize', function() {
					clearTimeout(instance._resizeTimer);

					instance._resizeTimer = setTimeout(function() {
						clearTimeout(instance._resizeTimer);
						instance.adaptBounds();
					}, instance.resizeInterval);

				});

			};

			var ins = this;
			this.getPanel().mousedown( function(){
				ins.fire( 'activate' );
			});
		},
		adaptBounds: function() {

			var panel = this.getPanel();
			if (!panel) return;
			var position = panel.css('position').toLowerCase();

			if ( 'fixed' != position ) {

				var bounds = this.getWinRect();
				var p = {
					width:	panel.width(),
					height: panel.height()
				};
				var x = y = w = h = 0;

				x = bounds.scrollLeft - this.leftOffset <= 0 ? 0 : bounds.scrollLeft - this.leftOffset;
				y = bounds.scrollTop - this.topOffset <= 0  ? 0 : bounds.scrollTop - this.topOffset;
				w = this.rightOffset;
				h = this.bottomOffset;

				w += bounds.width;
				h += bounds.height;

				if ( p.width  > w ) w = null;
				if ( p.height > h ) h = null;

				this.setRect({
					left:	x,
					top:	y,
					width:	w,
					height:	h
				});

			} else {

				this.setStyle('width' , '100%');
				this.setStyle('height', '100%');
				this.setStyle('left'  , '0');
				this.setStyle('top'   , '0');

			}
		},
		/**
		 * 跟随Panel同步展现和隐藏
		 */
		follow: function( panel ){
			if( !panel ) return;
			var ins = this;

			this.flollowPanel = panel;

			panel.on('aftershow', function(){
				ins.show();
				var zIndex = parseInt(panel.getZIndex(),10);
				ins.getPanel().css( 'z-index',zIndex - 1 );
			});
			panel.on('afterhide', function(){
				ins.hide();
			});
			panel.on('afterdispose', function(){
				ins.dispose();
			});

		},
		/**
		 * 如果在IE6下，Mask会使用iframe，但是iframe在响应点击事件时有问题：
		 * 1. 无法直接响应鼠标事件，必须获取iframe的document，然后注册
		 * 2. 如果document.domain修改了，那么获取iframe的document会有问题
		 * 因此现在的做法是将Mask结构中的panel-content放在iframe上面接收事件
		 */
		_coverIframe: function(){
			var panel = this.getPanel(),
				content = panel.find( '.panel-content' );

			content.css( 'position', 'absolute' )
				   .css( 'z-index', '1' )
				   .css( 'width', '100%')
				   .css( 'height', '100%');
		}
	} );

	return Mask;
});
